<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>


<!DOCTYPE html>
<html>
	<head>
		<title>Pagina Movimenti - MyBudget</title>
		<meta charset="UTF-8" />
		<link rel="stylesheet" type="text/css" href="css/style.css" />
		<script type="text/javascript" src="js/jquery-1.8.1.min.js"></script>
		<script type="text/javascript" src="js/jquery.blockUI.js"></script>
		<script type="text/javascript" src="js/XMLWriter-1.0.0-min.js"></script>
		<script type="text/javascript" src="js/jquery.popupWindow.js"></script>
		<script type="text/javascript" src="js/statementUIAnimator.js" defer="defer"></script>
	</head>

	<body>
		
		<header id="header" >
			<a href="/"><img src="img/logo.png" alt="MyBudget_logo"/></a>
			<nav id="loginInformation">
				<ul>
					<li>
						Hai effettuato l'accesso come ${username} 
					</li>
					<li>
						<a href="help.html" class="popUp">Aiuto</a>
					</li>
					<li>
						<a href="${logoutURL}">Disconnetti</a>
					</li>
				</ul>
			</nav>
			<nav id="tab">
				<ul>
					<li class="active">
						<a href="statementPage">Movimenti</a>
					</li>
					<li>
						<a href="synthesisPage">Riassunti</a>
					</li>
					
				</ul>
			</nav>
		</header>
		<section id="addNewItem">
			<form method="post" onsubmit="return false;" id="addNewItemForm" autocomplete="off" >
				<ul>
					<li>
						<input type="date" id="date" name="date" class="itemDate" required="required" />
					</li>
					<li>
						<input type="text" id="price" name="price" class="itemPrice" required="required" pattern="^\d+(|\,)\d{2}$" title="Completare nel formato #,## es: 10,68" placeholder="0,00 " />
					</li>
					<li>
						<input type="text" id="itemName" name="itemName" class="itemName" required="required" placeholder="Capitolo" />
					</li>
					<li>
						<input type="text" id="description" name="description" class="itemDescription" placeholder="Descrizione"  />
					</li>
					<li>
						<button onclick="submitAddRecord(this)">
							<img src="img/plusIcon.png" alt="plusIcon" />
							<span class="buttonTXT">Aggiungi</span>
						</button>
					</li>
				</ul>
			</form>
		</section>

		<section id="statement">
			<header id="statementHeader">
				<div class="itemDate">Data</div>
				<div class="itemPrice">Importo</div>
				<div class="itemName">Capitolo</div>
				<div class="itemDescription">Descrizione</div>
				
			</header>
			<section id="statmentList">
				<!-- Filled by Ajax -->
			</section>
				
			
		</section>
		<footer>
			<p>Copyright &copy; 2012 Tiziano Ceccarini</p>
		</footer>
	</body>
</html>